<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>个人网页</title>
  <link rel="stylesheet" href="./CSS/style.css">
  <link rel="stylesheet" href="./CSS/index.css">
  <!-- 确保CSS路径正确 -->
</head>

<body>
  <div class="container">
    <!-- 顶部搜索栏 -->
    <div class="container1">
      <div class="search-box">
        <input type="text" placeholder="搜索...">
      </div>
    </div>

    <!-- 导航栏 -->
    <div class="container2">
      <nav>
        <ul>
          <li><a href="index.html">首页</a></li>
          <li><a href="./page/project.html">项目</a></li>
          <li><a href="./page/course.html">课程</a></li>
          <li><a href="./page/thesis.html">论文</a></li>
          <li><a href="./page/philosophy.html">哲学</a></li>
          <li><a href="./page/competition.html">比赛</a></li>
          <li><a href="./page/interest.html">兴趣</a></li>
          <li><a href="./page/website.html">网站</a></li>
          <li><a href="./page/hotline.html">热线</a></li>
          <li><a href="./page/introduction.html">具体介绍</a></li>
        </ul>
      </nav>
    </div>

    <!-- 中间主要内容区（左侧：圆形按钮、卡片） -->
    <div class="often_use">
      <a class="circle-btn" id="website-btn" href="./page/website.html">常用网站</a>
      <a class="circle-btn" id="hotline-btn" href="./page/hotline.html">常用热线</a>
    </div>
    <div class="main-content">
      <a class="card" id="A1" href="./page/interest.html">作者想学</a>
      <a class="card" id="A2" href="./page/competition.html">比赛相关</a>
      <a class="card" id="A3" href="./page/course.html">大学课程内容</a>
      <a class="card" id="A4" href="./page/project.html">项目开发</a>
      <a class="card" id="A5" href="./page/thesis.html">论文写作</a>
      <a class="card" id="A6" href="./page/philosophy.html">哲学相关</a>
    </div>
    <div class="circle-btn custom-btn">自定义</div>



    <!-- 底部联系方式 -->
    <div class="contact">
      <h3>联系方式</h3>
      <p>邮箱：----</p>
      <p>电话：----</p>
    </div>
  </div>
  <!-- 右侧固定模块：作者自述 -->
  <div class="container3">
    <h3>作者自述</h3>
    <p>这里是作者的自述内容...</p>
  </div>

  <!-- 右侧固定模块：今日任务 -->
  <div class="container4">
    <div class="switch-btn" id="task-switch">切换</div>
    <h3 id="task-title">今日任务</h3>
    <ul id="task-list">
      <li>任务1</li>
      <li>任务2</li>
    </ul>
  </div>
  <script src="./javascript/script_index.js"></script> <!-- 若需交互，确保JS路径正确 -->
</body>

</html>